.scene-modal {
  color: rgb(0,0,0);
  border-radius: 3px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background-color: #F0F0F0;
  /* border: 1px solid transparent; */
  /* border-image: linear-gradient(to bottom right, rgba(82, 149, 204,0.6), rgba(0, 141, 255,0.6)) 1; */
  /* background: linear-gradient(to bottom left, rgba(6, 11, 24, 0.8), rgba(42, 72, 155, 0.8)); */

  display: flex;
  align-items: center;
  justify-content: center;
}

body::backdrop{
  background-color: rgba(0,0,0,0.6);
}


.scene-modal-close{
  position: absolute;
  width: 1.6vw;
  height: 1.6vw;
  /* aspect-ratio: 1; */
  top: 0.5vh;
  right: 0.2vw;
  z-index: 10;
  cursor: pointer;
  border-radius: 50%;
  transition: all 0.3s ease-in;
  transform-origin: center center;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}
.scene-modal-close:hover{
  background-color: rgba(0,0,0,0.2);
  transform: rotateZ(180deg);
}

.slide-left-animate-enter-active,
.slide-left-animate-leave-active {
  transition: all 0.6s ease;
}

.slide-left-animate-enter-from {
  transform: translateX(-100%);
  opacity: 0;
}

.slide-left-animate-leave-to {
  transform: translateX(-100%);
  opacity: 0;
}

/* 右侧滑入滑出动画 */
.slide-right-animate-enter-active,
.slide-right-animate-leave-active {
  transition: all 0.6s ease;
}

.slide-right-animate-enter-from {
  transform: translateX(100%);
  opacity: 0;
}

.slide-right-animate-leave-to {
  transform: translateX(100%);
  opacity: 0;
}


/* 进入动画 - 初始状态 */
.scale-enter-from {
  transform: scale(0);
  transform-origin: left top;
  opacity: 0;
}

/* 进入动画 - 结束状态 */
.scale-enter-to {
  transform: scale(1);
  opacity: 1;
}

/* 进入动画 - 过渡过程 */
.scale-enter-active {
  transition: all 0.3s ease-in; /* 动画时长0.5秒，缓动效果 */
}

/* 离开动画 - 初始状态（开始离开时的状态） */
.scale-leave-from {
  transform: scale(1);
  opacity: 1;
}

/* 离开动画 - 结束状态（离开后的状态） */
.scale-leave-to {
  transform: scale(0);
  opacity: 0;
  transform-origin: right top;
}

/* 离开动画 - 过渡过程 */
.scale-leave-active {
  transition: all 0.3s ease-out;
}